var MessageBoard = {
    
    messages: [],
    
    init: function(appId)
    {
        // Init the array containing all the messages.
        messages = new Array();
        
        // Add an onclick event to the postMessageButton.
        var button = document.getElementById("postMessageButton");
        button.addEventListener("click", MessageBoard.postButtonOnClick, false);
        
        // Add an eventHandler to the textarea.
        var textarea = document.getElementById("messageInputArea");
        textarea.addEventListener("keypress", MessageBoard.textAreaEventHandler, false);
        
        // Load all messages.
        MessageBoard.renderMessages();
        
        // Get the number of messages in the array.
        MessageBoard.updateNumberOfMessages();   
    },
    
    textAreaEventHandler: function(e)
    {
        if (!e) var e = window.event;
        
        if (e.keyCode == 13 && !e.shiftKey)
        {
            MessageBoard.postButtonOnClick();
        }
    },
    
    updateNumberOfMessages: function()
    {
        var nrOfMess = document.getElementById("numberOfMessages");
        nrOfMess.innerHTML = "Antal meddelanden: " + messages.length;
    },
    
    postButtonOnClick: function()
    {
        // Get the textarea.
        var textarea = document.getElementById("messageInputArea");
        
        // Get the text.
        var text = textarea.value;
        
        // Check if the user actually wrote something.
        if (text.length > 0)
        {
            // Create a new Message using the text from the textarea.
            var mess = new Message(text, new Date());
            
            // Add the message to the array.
            messages.push(mess);
            
            // Render the new message.
            MessageBoard.renderMessage(messages.length-1);
            
            // Update the number of messages since we added a new one.
            MessageBoard.updateNumberOfMessages();
        }
        textarea.value = '';
    },
    
    renderMessage: function(messageId)
    {
        // Create a new node containing the new message.
        var newMessageNode = document.createElement("div");
        newMessageNode.className = "message";
        
        // Create the content on the new node and add it to the node.
        var htmlString = "<div>" + messages[messageId].getHTMLText() + "</div>" +
                         "<div class=\"timeStamp\">" + messages[messageId].getTimeStamp() + "</div>";
        newMessageNode.innerHTML = htmlString;
        
        // Add the new message to the messageContainer.
        document.getElementById("messageContainer").appendChild(newMessageNode);
      
        // Create a close message element.
        var closeNode = document.createElement("div");
        closeNode.className = "close";
        
        // Add it to the DOM-tree.
        newMessageNode.appendChild(closeNode);        
      
        // Create an onclick event for the close element.
        closeNode.addEventListener("click", function(){MessageBoard.removeMessage(messageId)}, false);
        
        // Create an element to show an alert with the date and time.
        var dateAlertNode = document.createElement("div");
        dateAlertNode.className = "dateAlert";
        
        // Add it to the DOM-tree.
        newMessageNode.appendChild(dateAlertNode);
        
        // Create an onlclick event for the date/time alert.
        dateAlertNode.addEventListener("click", function(){MessageBoard.showDateTimeAlert(messageId)}, false);  
    },
    
    showDateTimeAlert: function(messageId)
    {
        var alertMessage = "Inlägget skapades den " + messages[messageId].getFormatedDateTime();
        alert(alertMessage);
    },
    
    removeMessage: function(messageId)
    {
        if (window.confirm("Vill du verkligen radera meddelandet?"))
        {
            // Remove the message.
            messages.splice(messageId, 1);
            
            // Render all the messages again.
            MessageBoard.renderMessages();
            
            // Update the number of messages.
            MessageBoard.updateNumberOfMessages();
        }
    },
    
    renderMessages: function()
    {
        // Remove all messages.
        document.getElementById("messageContainer").innerHTML ="";
        
        // Render all messages.
        for (var i = 0; i < messages.length; i++)
        {
            MessageBoard.renderMessage(i);
        }
    }
    
}

window.onload = MessageBoard.init;

// Discuss.
/* function addEventHandler(element, eventToBind, functionReference, useCapture)
{
    if (element.addEventListener)
    {
        if (event.istype(String))
        {
            element.addEventListener(eventToBind, functionReference, useCapture);
        }
        else
        {
            throw new Error("Event has to be of type String");
        }
    }
    else if (element.attachEvent)
    {
        element.attachEvent(eventToBind, functionReference);
    }
}
*/